<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>创建UBISOFT账号</title>
		<style type="text/css">
			html,
			body {
				background-color: #000000;
				font-size: 13px;
				/* background: url(imgs/bg.jpg); */
				font-size: inherit;
				color: #FFFFFF;
			}

			.liubai {
				height: 50px;
				width: 100%;
			}

			.Box1 {
				margin-left: auto;
				margin-right: auto;
				padding-left: 13px;
				padding-right: 13px;
				/* border: #EE0000 solid 1px; */
			}

			.Box2 {
				margin: 30px 300px;
				width: 500px;
				/* border: #EE0000 solid 1px; */
				/* background: url(imgs/bg.jpg); */
			}

			.xiaoLiubai {
				height: 30px;
				width: 100%;
				/* border: #EE0000 solid 1px; */
			}

			.xiaoLiubai1 {
				height: 10px;
				width: 100%;
				/* border: #EE0000 solid 1px; */
			}

			.logo {
				margin-right: 150px;
				margin-left: 150px;
				font-size: 30px;
			}

			.tishi {
				margin-left: 50px;
				margin-top: 5px;
				margin-bottom: 5px;
				font-size: 20px;
			}

			.duihuakuang {
				margin-left: 0px;
				margin-right: 0px;
				padding-top: 10px;
				/* border: #EE0000 solid 1px; */
			}

			.tishiwenzi {
				margin-left: 50px;
			}

			.shurukuang {
				margin-left: 50px;
			}

			.Td {
				/* border: #696969 solid 1px; */
				width: 180px;
				padding: 5px;

			}

			.Td a {
				text-decoration: none;
				font-style: oblique;
				color: #FFFFFF;
			}

			.checkbox {
				margin-left: 50px;
				margin-top: 5px;
				margin-bottom: 10px;
				font-size: 10px;
				/* font-style: oblique; */
				font-weight: 600;
				color: #FFFFFF;
			}

			.creatID {
				color: #FFFFFF;
				background-color: #294174;
				border-color: #294174;
				font-size: 1.3em;
				height: 29px;
				font-weight: 500;
				margin: 10px 20px;
				align-content: center;
				text-align: center;
			}

			.creatID a {
				text-decoration: none;
				text-align: center;
				color: #FFFFFF;
			}
			
			.checkbox a{
				text-decoration: none;
				font-style: oblique;
				font-size: 10px;
				color: #FFFFFF;
			}
			
			
			
		</style>
	</head>
	<body>
		<div class="liubai">

		</div>
		<div class="Box1">
			<div class="Box2">
				<div class="xiaoLiubai">

				</div>
				<div class="jiemian">
					<div class="top">
						<div class="logo">
							<img src="imgs/Ubi-logo1.jpg" style="width: 30px; height: 30px; align-self: center;" />UBISOFT
						</div>
						<div class="xiaoLiubai">
						
						</div>
						<div class="tishi">
							创建一个Ubisoft账号
						</div>
						<div class="duihuakuang">
							<div id="youxiang" class="tishiwenzi" style="font-size: 17px;">
								邮箱
							</div>
							<div id="eMail" class="shurukuang">
								<input type="text" style="width: 400px;" />
							</div>
							<div class="xiaoLiubai">

							</div>
							<div id="querenyouxiang" class="tishiwenzi" style="font-size: 17px;">
								确认您的邮箱地址
							</div>
							<div id="eMail" class="shurukuang">
								<input type="text" style="width: 400px;" />
							</div>
							<div class="xiaoLiubai">

							</div>
							<div id="userpassword" class="tishiwenzi" style="font-size: 17px;">
								密码
							</div>
							<div id="eMail" class="shurukuang">
								<input type="text" style="width: 400px;" />
							</div>
							<div class="xiaoLiubai1">

							</div>
							<div id="ubiusername" class="tishiwenzi" style="font-size: 17px;">
								Ubisoft用户名
							</div>
							<div id="eMail" class="shurukuang">
								<input type="text" style="width: 400px;" />
							</div>
							<div class="xiaoLiubai">

							</div>

							<div class="select" style="margin-left: 50px;">
								<div class="">
									<p>选择出生日期</p>
								</div>
								<div id="day" class="birth">
									<form name="date">
										<select name="year" onchange="selectYear(this.value)" style="width: 70px;">
											<option value="">年</option>
										</select>
										<select name="month" onchange="selectMonth(this.value)" style="width: 70px;">
											<option value="">月</option>
										</select>
										<select name="day" style="width: 70px;">
											<option value="">日</option>
										</select>
									</form>
								</div>
								<div id="month" class="birth">

								</div>
								<div id="year" class="birth">

								</div>
							</div>
							<div class="xiaoLiubai1">
							
							</div>
							<div class="checkbox" id="RememberMe">
								<input type="checkbox" />我接受育碧的<a href="#">使用条款</a>，<a href="#">销售条款</a>和<a href="#">隐私政策</a>。
							</div>
							<div class="xiaoLiubai1">

							</div>
							<div class="checkbox" id="RememberMe">
								<input type="checkbox" /><a href="#">與制定第三方分享我的咨詢</a>
							</div>
							<div class="xiaoLiubai1">
							
							</div>
							<div class="creatID">

								<a href="#">
									<div class="wenzi1">
										创建一个UBISOFT账号
									</div>
								</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- 年月日选择下拉列表框js -->
		<script language="JavaScript">
			function dateStart() {
				//月份对应天数
				MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

				//给年下拉框赋内容   
				var y = new Date().getFullYear();
				for (var i = (y - 50); i < (y + 50); i++) //以今年为准，前50年，后50年   
					document.date.year.options.add(new Option(" " + i + " 年", i));

				//给月下拉框赋内容   
				for (var i = 1; i < 13; i++)
					document.date.month.options.add(new Option(" " + i + " 月", i));

				document.date.year.value = y;
				document.date.month.value = new Date().getMonth() + 1;
				var n = MonHead[new Date().getMonth()];
				if (new Date().getMonth() == 1 && IsPinYear(yearvalue))
					n++;
				writeDay(n); //赋日期下拉框   
				document.date.day.value = new Date().getDate();
			}

			if (document.attachEvent)
				window.attachEvent("onload", dateStart);
			else
				window.addEventListener('load', dateStart, false);

			function selectYear(str) //年发生变化时日期发生变化(主要是判断闰平年)   
			{
				var monthvalue = document.date.month.options[document.date.month.selectedIndex].value;
				if (monthvalue == "") {
					var e = document.date.day;
					optionsClear(e);
					return;
				}
				var n = MonHead[monthvalue - 1];
				if (monthvalue == 2 && IsPinYear(str))
					n++;
				writeDay(n);
			}

			function selectMonth(str) //月发生变化时日期联动   
			{
				var yearvalue = document.date.year.options[document.date.year.selectedIndex].value;
				if (yearvalue == "") {
					var e = document.date.day;
					optionsClear(e);
					return;
				}
				var n = MonHead[str - 1];
				if (str == 2 && IsPinYear(yearvalue))
					n++;
				writeDay(n);
			}

			function writeDay(n) //据条件写日期的下拉框   
			{
				var e = document.date.day;
				optionsClear(e);
				for (var i = 1; i < (n + 1); i++)
					e.options.add(new Option(" " + i + " 日", i));
			}

			function IsPinYear(year) //判断是否闰平年   
			{
				return (0 == year % 4 && (year % 100 != 0 || year % 400 == 0));
			}

			function optionsClear(e) {
				e.options.length = 1;
			}
		</script>

	</body>
</html>
